<template>
    <div class="mine-main-container mine-wallet-container">
      <p class="wallet-title" :icon="WarningFilled">
          <span>钱包余额</span>
          <el-icon >
              <WarningFilled />
          </el-icon>
      <div class="tip_icon" aria-describedby="ele-WarningFilled" tabindex="0">
      </div>
      </p>
      <div class="wallet-prize-container">
          <div class="available_price">￥0.00</div>
      </div>
      <div class="withdraw_button"> 
        <button  type="button" class="withdrawal">
          <span>提现</span>
      </button>
      </div>
      <div class="bottom-tip-container">
          <span data-v-37831a12="" data-v-54cc36bb="" class="contact-tip">
              <div data-v-37831a12="" class="icon-item normal el-popover__reference" :icon="WarningFilled" tabindex="0">
                <el-icon >
                    <WarningFilled />
                </el-icon>
                  <span >联系客服</span></div>
          </span>
      </div>
   </div>
   
    <el-card shadow="always" style="margin-top:20px">
      <p class="moneey-title">
          钱包明细
          <el-icon >
              <WarningFilled />
          </el-icon>
      <hr style="margin-top:20px"/>
      <div class="tip_icon" aria-describedby="el-tooltip-1337" tabindex="0">
      </div>
      </p>
      <span class="abcd">暂无数据</span>
    </el-card>
  
  </template>

<script lang="ts">
import { defineComponent } from "vue";

export default defineComponent({
    name: "my_wallet",
});
</script>

<script setup lang="ts">
    // import { WarningFilled } from "@element-plus/icons-vue";
    import { Search ,WarningFilled} from '@element-plus/icons-vue'
</script>

<style scoped>
    .wallet-title{
        font: size 16px;
        color:#111;
        text-align:center;
        margin: 32px,0;
        position:relative;
    }
    /* .wallet-title::after{
      content:"\e685" ;
      font-family: "iconfont";
      position: absolute;
      top: -13px;
      width: 15px;
      height: 30px;
      right: 430px;
    } */
    .wallet-prize-container{
        padding: 60px 0 51px;
    }
    .available_price{
        font-size: 26px;
        color: #111;
        text-align: center;
        font-weight: 700;
    }
    .withdraw_button{
        width: 100%;
        margin: 0 auto;
    }
    .withdrawal{
        width: 180px;
        height: 50px;
        /* margin: 0 auto; */
        margin-left: 410px;
        border-radius: 10px;
        background-color:#fc9bc2;
        border: none;

    }
    .withdrawal span {
        color:#fff;
        font-size: 14px;
    }
    .bottom-tip-container{
      text-align: center;
      padding: 111px 0 16px;
    }
    /* .tip::before{ 
      content:"\e638" ;
      font-family: "iconfont";
      width: 20px;
      height: 20px;
      margin-right: 12px;
      vertical-align: text-bottom;
      transform: translateY(-1px);
    } */
    .moneey-title{
        font: size 16px;
        color:#111;
        text-align:left;
        margin: 32px 0;
        position:relative;
    }
    /* .moneey-title::after{
      content:"\e685" ;
      font-family: "iconfont";
      position: absolute;
      top: -13px;
      width: 15px;
      height: 30px;
      right: 865px;
    } */
  .el-card__body .abcd{
      text-align:center;
      font-size: 14px;
      padding: 20px 0px;
      color: #909399;
  }   
</style>
